<template>
	<z-paging ref="paging" v-model="dataList" @query="queryList"
		:loading-more-custom-style="{ paddingBottom: 'env(safe-area-inset-bottom)' }">
		<template #top>
			<view class="zpagin_top">
				<nav-bar :iconLeft="true" />
				<up-tabs :list="list" lineWidth="25" @change="tab_change" :scrollable="true"></up-tabs>
				<view class="search">
					<custom-search v-model="queryParams.search" @search="refreshList" placeholder="请输入采购单号/采购员姓名" />
				</view>
				<dui-float-ball :pathUrl="`${pageUrl}/compile`" v-if="$hasPerm(['50201'])" />
			</view>
		</template>

		<u-swipe-action>
			<u-swipe-action-item v-for="item in dataList" :key="item.id"
				:name="JSON.stringify(swipeActPer(options, item.status_display)) + '&' + item.id + '&' + item.code"
				:options="swipeActPer(options, item.status_display)"
				:disabled="swipeActPer(options, item.status_display, 'disabled')" @click="action">
				<uni-card margin="0" spacing="0" @click="goDetail(item, pageUrl, '50204')">
					<template v-slot:title>
						<uni-list>
							<uni-list-item :title="item.code" thumbSize="lg">
								<template v-slot:footer>
									<up-tag size="mini" :text="status_list[item.status_display].text" plain plainFill
										:type="status_list[item.status_display].type" />
								</template>
							</uni-list-item>
						</uni-list>
					</template>

					<view class="ctent">下单时间：{{ item.order_date }}</view>
					<view class="ctent">采购交货日期：{{ item.delivery_date }}</view>
					<view class="con" style="align-items: normal;">
						<view class="ctent" style="flex: none;">供应商：</view>
						<view class="ctent">{{ item.supplier_info }}</view>
					</view>
					<view class="ctent">采购员：{{ item.purchase_full_name }}</view>
					<view class="con">
						<view class="ctent">采购数：{{ item.order_num }}</view>
						<view class="ctent">总金额(元)：{{ item.order_price }}</view>
					</view>
					<view class="con">
						<view class="ctent">已交货数：{{ item.order_price }}</view>
						<view class="ctent">退货数：{{ item.all_finish_num }}</view>
					</view>
					<view class="con">
						<view class="ctent">退货金额(元)：{{ item.all_slaes_price }}</view>
						<view class="ctent">应付账款(元)：{{ item.receivable_price }}</view>
					</view>
					<view class="con">
						<view class="ctent">制单人：{{ item.create_full_name }}</view>
						<view class="ctent">审核人：{{ item.apply_full_name || '' }}</view>
					</view>
					<view class="ctent">结单人：{{ item.finish_full_name || '' }}</view>
					<view class="ctent">计划单号：{{ item.plan_code }}</view>
					<view class="con_button" v-if="$hasPerm(['50205'])" v-show="item.status_display == '待审核'"
						@click.stop="applyAct_act(item)"> 审核
					</view>
					<view class="con_button" v-if="$hasPerm(['50206'])" v-show="item.status_display == '入库中'"
						@click.stop="hanldAct(item.id, 4, '结单成功')"> 结单
					</view>
					<view class="con_button" v-if="$hasPerm(['50207'])" v-show="item.status_display == '已结单'"
						@click.stop="hanldAct(item.id, 3, '反结单成功')"> 反结单
					</view>
				</uni-card>
			</u-swipe-action-item>
		</u-swipe-action>
		<view slot="bottom">
			<custom-popup :popupShow="popupShow" mode="center" :title="`审核：【${apply_title}】`" @close="popupShow = false"
				height="300rpx" width="90%">
				<div
					style="background-color: #fff;height: 100%; display: flex; justify-content: space-between;flex-direction: column;">
					<div style="padding: 10rpx 20rpx;">审核通过或者拒绝后，不支持修改，请确认?</div>
					<div style="display: flex; gap: 10rpx;width: 50%; margin-left:auto ;padding: 15rpx 20rpx;">
						<u-button text="通过" icon="checkmark" size="small" type="primary" @click="applyAct(2, '审核成功')"></u-button>
						<u-button text="拒绝" icon="close" size="small" type="error" @click="applyAct(5, '拒绝成功')"></u-button>
					</div>
				</div>
			</custom-popup>
		</view>
	</z-paging>
</template>
<script setup>
import { ref, reactive } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import puOrderApi from '../../../api/purchase/pu_order'
import { debounce } from '@/utils/index.js' // 用防抖优化请求频率（下面给出）
import { swipeActPer, goDetail } from '@/utils/permission'

uni.$bus.useBusOn('pu_order:refresh', refreshList)




const options = [
	{
		text: '修改', per: '50202',
		style: {
			backgroundColor: '#0081ff'
		}
	}, {
		text: '删除', per: '50203',
		style: {
			backgroundColor: '#f56c6c'
		}
	}
]

const pageUrl = '/views/purchase/pu_order'

//数据请求
const paging = ref(null);
const dataList = ref([]);
const queryParams = reactive({
	search: '',
	status: ''
})
function queryList(pageNo, pageSize) {
	const params = {
		page: pageNo,
		page_size: pageSize,
		...queryParams
	}
	puOrderApi.get_purchase_order(params).then((res) => {
		paging.value.complete(res.results);
	})
}

const tab_change = debounce(function (v) {
	queryParams.status = v.status;
	refreshList();
}, 500)

function hanldAct(id, status, text) {
	const params = {
		status, if_handle: 1
	}
	puOrderApi.patch_purchase_order(params, id).then(res => {
		uni.$u.toast(text)
		setTimeout(() => {
			refreshList();
		}, 500)
	})
}

const popupShow = ref(false)
const apply_title = ref('')
let apply_record = {}
function applyAct_act(item) {
	popupShow.value = true
	apply_title.value = item.code
	apply_record = item
}
function applyAct(typeNum, text) {
	const params = {
		status: typeNum, if_handle: 1
	}
	puOrderApi.patch_purchase_order(params, apply_record.id).then(res => {
		uni.$u.toast(text)
		setTimeout(() => {
			apply_record = {}
			apply_title.value = ''
			popupShow.value = false
			refreshList();
		}, 500)
	})
}
//滑动操作按钮
function action(v) {
	const options = JSON.parse(v.name.split("&")[0])
	const id = v.name.split("&")[1]
	const delName = '单号为：' + v.name.split("&")[2]
	const index = v.index
	if (options[index].text == '修改') {
		uni.navigateTo({
			url: `${pageUrl}/compile?type=edit&id=${id}`
		})
	}
	if (options[index].text == '删除') {
		delete_type(id, delName)
	}
}
//删除操作
function delete_type(id, delName) {
	uni.showModal({
		title: '提示',
		content: `确认要删除单号为：【${delName}】的数据项吗？`,
		success: (res) => {
			if (res.confirm) {
				delete_purchase_order(id).then((res) => {
					uni.$u.toast('删除成功')
					setTimeout(() => {
						refreshList();
					}, 500)
				})
			}
		}
	});
}
//编辑跳转刷新
function refreshList() {
	paging.value.reload();
}
const status_list = {
	'待审核': { text: '待审核', type: 'warning' },
	'已审核': { text: '已审核', type: 'primary' },
	'入库中': { text: '入库中', type: 'info' },
	'已结单': { text: '已结单', type: 'success' },
	'已拒绝': { text: '已拒绝', type: 'error' },
}
const list = [
	{ name: '全部', status: "" },
	{ name: '待审核', status: "1" },
	{ name: '已审核', status: "2" },
	{ name: '入库中', status: "3" },
	{ name: '已结单', status: "4" },
	{ name: '已拒绝', status: "5" },
]
</script>

<style lang="scss"></style>